html {
    height: 100%;
    body {
        height: 100%;
        background-color: #f4f4f4;
        .index {
            max-width: 750px;
            min-width: 300px;
            height: 100%;
            margin: 0 auto;
            position: relative;
            .topbar {
                width: 100%;
                height: 1.066666rem;
                background-color: #fff;
                text-align: center;
                a {
                    float: left;
                    display: block;
                    width: 10%;
                    height: 100%;
                    i {
                        display: block;
                        font-size: 0.466666rem;
                        line-height: 1.066666rem;
                    }
                }
                p {
                    float: left;
                    display: block;
                    width: 80%;
                    margin-right: 10%;
                    font-size: 0.466666rem;
                    line-height: 1.066666rem;
                }
            }
            .tool {
                width: 84%;
                padding: 2% 6% 0;
                margin: 0.2rem auto;
                border-radius: 5px;
                background-color: #f7f7f7;
                box-shadow: 0px 0px 3px 1px #E2E2E2;
                .title {
                    width: 100%;
                    display: table;
                    height: 1rem;
                    border-bottom: 1px dashed #ccc;
                    .tool-name {
                        width: 70%;
                        display: table-cell;
                        vertical-align: middle;
                        font-size: 0.373333rem;
                        font-weight: 600;
                    }
                    .rent-state {
                        width: 30%;
                        display: table-cell;
                        vertical-align: middle;
                        font-size: 0.346666rem;
                        text-align: right;
                    }
                    .backed{
                        color: #00baff;
                    }
                    .noback{
                        color: #ffba00;
                    }
                }
                ul {
                    margin-top: 0.3rem;
                    display: block;
                    width: 100%;
                    li {
                        display: block;
                        width: 100%;
                        font-size: 0.333333rem;
                        color: #616161;
                        i {
                            float: left;
                            display: inline-block;
                            width: 16%;
                            text-align: justify;
                        }
                        i:after {
                            content: " ";
                            display: inline-block;
                            width: 100%;
                        }
                        span{
                            float: left;
                            display: inline-block;
                            width: 4%;
                            text-align: center;
                        }
                        p {
                            float: left;
                            display: inline-block;
                            width: 80%;
                        }
                    }
                    .bottom{
                        p{
                            width: 70%;
                            float: left;
                            .back-date{
                                width: 40%;
                            }
                        }
                        .backer{
                            width: 30%;
                            float: right;
                        }
                        i{
                            float: none;
                            display: inline;
                        }
                        
                    }
                }
            }
        }
    }
}